import styled from 'styled-components'

const HeaderbarContainer = styled.div`
  z-index:10000;
  position:relative;
  background:#2e59e6;
  line-height:0.45rem;
  font-size:0.16rem;
  color:white;
  font-weight:200;
  display:flex;
  flex-direction: row;
  ul{
    position:relative;
    display:flex;
    width:2rem;
    li{
      flex-direction:row;
      flex:1;
      text-align:center;
      .active{
        align-items:center;
        flex:1;
        height:0.3rem;
        border-bottom:0.025rem solid orange;
        font-size:0.2rem;
        font-family:Arial, Helvetica, sans-serif;
        font-weight:900;
      }
    }
  }
  .search{
    display:flex;
    flex:1;
    height:0.45rem;
    align-items:center;
    justify-content:flex-end;
   
    div{
      display:flex;
      height:0.25rem;
      width:0.25rem;
      margin-right:0.3rem;
      img{
        height:100%;
        width:100%;
      }
    }
  }
`

export {
  HeaderbarContainer
}